import { create } from "zustand";
import { nanoid } from "nanoid";

//zustand--使用介绍 https://blog.csdn.net/weixin_42268006/article/details/135989115

interface PresentationStore {
  sildeFatherId: string;
  slideFatnerList: any[];
  slideTitle: string;
  slideImage: string;
  sildeBgType: string;
  sildeBgVal: string;
  sildeBgVal2: string;
  slideList: any[];
  presentations: any[];
  currentPresentation: any | null;
  currentSlideIndex: number;
  addSlide: () => void;
  updateSlide: (newSlideList: any[]) => void;
  updateSlideTitle: (newSlideTitle: any) => void;
  deleteSlide: (newSlideList: any[]) => void;
  setCurrentPresentation: (index: number) => void;
  updateAnyData: (newData: any) => void;
}

export const useStore = create<PresentationStore>((set) => ({
  sildeFatherId: "", // 幻灯片多组时的一个item的id
  slideFatnerList: [],
  slideList: [
    {
      sortId: 1,
      id: nanoid(),
      elements: [],
    },
  ],
  // slideList: [
  //   {
  //     sortId: 1,
  //     id: nanoid(),
  //     elements: mockData1 || [],
  //   },
  //   {
  //     sortId: 2,
  //     id: nanoid(),
  //     elements: mockData2 || [],
  //   },
  //   {
  //     sortId: 3,
  //     id: nanoid(),
  //     elements: [],
  //   },
  // ],
  currentSlideIndex: 1, // 当前幻灯片索引
  slideTitle: "我是标题",
  slideImage: "",
  sildeBgType: "",
  sildeBgVal: "",
  sildeBgVal2: "",
  // 我的结束***
  presentations: [],
  currentPresentation: null,
  // 设置-当前幻灯片--index
  setCurrentPresentation: (index) => {
    set((state) => ({
      currentSlideIndex: index,
    }));
  },
  // 新增空白幻灯片
  addSlide: () => {
    set((state) => {
      // if (!state.currentPresentation) return state;
      const newSlide: any = {
        sortId: state.slideList.length + 1,
        id: nanoid(),
        elements: [],
      };
      const slideListBro = [...state.slideList, newSlide];
      return {
        slideList: slideListBro,
      };
    });
  },
  // 更新幻灯片中的元素--新增或者修改
  updateSlide: (newSlideList) => {
    set((state) => ({
      slideList: newSlideList,
    }));
  },
  deleteSlide: (newSlideList) => {
    set((state) => ({
      slideList: newSlideList,
      currentSlideIndex: 1,
    }));
  },
  updateSlideTitle: (newSlideTitle) => {
    set((state) => ({
      slideTitle: newSlideTitle,
    }));
  },
  updateAnyData: (newData: any) => {
    set((state) => ({
      ...newData,
    }));
  },

  // 我的结束***
}));
